<template>
    <div class="box-padding app-content">
        <!-- <div class="role-title">{{ $route.params.name }}</div> -->
        <Row :gutter="16">
            <Col span="4">
                <Select v-model="parmes.whereMap.proId" placeholder="项目名称" disabled>
                    <Option v-for="item in projectList" :value="item.id" :key="item.id">{{ item.shortName }}</Option>
                </Select>
            </Col>
            <Col span="4">
                <Input v-model="parmes.whereMap.controlTime" placeholder="每月动态" disabled />
                <!-- <DatePicker v-model="controlTime" type="month" format="yyyy-MM" placeholder="每月动态" disabled></DatePicker> -->
            </Col>
            <Col span="4">
                <Select v-model="parmes.whereMap.constructionPointId" placeholder="工点名称" clearable>
                    <Option v-for="item in workLedgerList" :value="item.id" :key="item.id">{{ item.name }}</Option>
                </Select>
            </Col>
            <Col span="4">
                <Select v-model="parmes.whereMap.constructionPointRiskLevel" placeholder="工点风险等级" clearable>
                    <Option v-for="item in leveList" :value="item.code" :key="item.id">{{ item.name }}</Option>
                </Select>
            </Col>
            <Col span="4">
                <Select v-model="parmes.whereMap.riskLevel" placeholder="作业风险等级" clearable>
                    <Option v-for="item in riskLevelarr" :value="item.id" :key="item.id">{{ item.name }}</Option>
                </Select>
            </Col>
            <Col span="4">
                <Select v-model="parmes.whereMap.isWorkedThisMonth" placeholder="当月是否作业" clearable>
                    <Option value="1">是</Option>
                    <Option value="2">否</Option>
                </Select>
            </Col>
        </Row>
        <Row :gutter="16" style="margin-top:10px;">
            <Col span="4">
                <Select v-model="parmes.whereMap.riskCategoryIds" placeholder="作业风险类别" clearable>
                    <Option v-for="item in operatingRisk" :value="item.id" :key="item.id">{{ item.riskCategoryName }}</Option>
                </Select>
            </Col>
            <Col span="4" offset="16" style="text-align:right;">
                <Button style="margin-right:10px;" @click="parmes.whereMap.controlTime='',parmes.whereMap.constructionPointId='',
                parmes.whereMap.constructionPointRiskLevel='',parmes.whereMap.isWorkedThisMonth='',parmes.whereMap.riskCategoryIds='',parmes.whereMap.measureType=''">重置</Button>
                <Button type="primary" @click="parmes.currentPage = 1,dynamicControlReportList()">查询</Button>
            </Col>
        </Row>
        <div class="those-box">
            <Row :gutter="16" style="margin-top: 10px;">
                <Col span="4" style="font-size:13px;font-weight:bold; color:#627181;">风险总数：{{riskNum.risk ? riskNum.risk.total : 0}}项</Col>
                <Col span="4" style="font-size:13px;">Ⅰ级：{{riskNum.risk ? riskNum.risk.firstLevel : 0}}项</Col>
                <Col span="4" style="font-size:13px;">Ⅱ级：{{riskNum.risk ? riskNum.risk.secondLevel : 0}}项</Col>
                <Col span="4" style="font-size:13px;">Ⅲ级：{{riskNum.risk ? riskNum.risk.thirdLevel : 0}}项</Col>
                <Col span="4" style="font-size:13px;">Ⅳ级：{{riskNum.risk ? riskNum.risk.fourthLevel : 0}}项</Col>
            </Row>
        </div>
        <Table border :columns="columns1" :data="data1" style="margin-top:20px;" @on-selection-change="selectRowTable">
            <template slot-scope="{ row, index }" slot="action">
                <a @click="detailModal = !detailModal, detailObj= row">详情</a>
            </template>
        </Table>
        <div class="page-div">
            <Page
            class="tab-page"
            :total="total"
            :current="parmes.currentPage"
            :page-size="parmes.pageSize"
            @on-change="pageChange"
            @on-page-size-change="sizeChange"
            show-elevator
            show-sizer
            :page-size-opts='[10,20,50,100]'
            show-total
            />
        </div>
        <Modal v-model="detailModal" title="风险信息" width="70%" :footer-hide="true">
            <div class="modal-content">
                <tab1 :detailObj="detailObj"></tab1>
            </div>
        </Modal>
        <div style="text-align:center;margin-top:20px;">
            <Button type="primary" @click="$emit('isLastMonthMethods',false),$emit('addList',selectTable)">确定</Button>
            <Button style="margin-left: 20px;" @click="$emit('isLastMonthMethods',false)">取消</Button>
        </div>
    </div>
</template>
<script>
import crudMixin from '../../../mixins/crudMixin'
import tab1 from './detail-tab-month/tab1'
import tab2 from './detail-tab-month/tab2'
export default {
    props:['projectIds'],
    mixins: [crudMixin],
    components:{
        tab1,
        tab2
    },
    data(){
        return{
            workLedgerList:[],   // 工点名称列表
            operatingRisk:[],    // 作业风险类型列表
            riskNum:{},          // 风险数量汇总
            selectTable:[],      // 选择
            detailModal:false,
            total:0,
            parmes:{
                currentPage:1,
                pageSize:10,
                orderSort:'asc',
                whereMap:{
                    constructionPointId:'', // 工点
                    constructionPointRiskLevel:'',  //工点风险等级
                    isWorkedThisMonth:'',   // 当月是否作业
                    riskCategoryIds:'',     //  作业风险类型
                    measureType:'', //  措施类型
                    orgId:'',   // 公司机构
                    proId:'',   // 项目
                    riskLevel:'',   //  风险作业等级
                    controlTime:'', //  每月动态时间
                }
            },
            riskLevelarr:[
                {
                    id:1,
                    name:'Ⅰ级'
                },
                {
                    id:2,
                    name:'Ⅱ级'
                },
                {
                    id:3,
                    name:'Ⅲ级'
                },
                {
                    id:4,
                    name:'Ⅳ级'
                }
            ],
            columns1: [
                {
                    type: 'selection',
                    align: 'center',
                    width: 60,
                },
                {
                    title: '序号',
                    align: 'center',
                    width: 60,
                    render: (h, params) => {
                        return h(
                            'span',
                            params.index + (this.parmes.currentPage - 1) * this.parmes.pageSize + 1
                        )
                    }
                },
                {
                    title: '公司名称',
                    key: 'enterpriseName',
                    align: 'center'
                },
                {
                    title: '项目名称',
                    key: 'projectName',
                    align: 'center'
                },
                {
                    title: '工点名称',
                    key: 'pointName',
                    align: 'center'
                },
                {
                    title: '工点风险等级',
                    align: 'center',
                    key: 'pointRiskGradeName',
                },
                {
                    title: '作业风险名称',
                    key: 'riskOperationName',
                    align: 'center'
                },
                {
                    title: '作业风险类别',
                    key: 'riskCategoryNames',
                    align: 'center'
                },
                {
                    title: '作业风险等级',
                    align: 'center',
                    key: 'riskLevelName',
                },
                {
                    title: '操作',
                    slot: 'action',
                    width: 60,
                    align: 'center'
                },
            ],
            data1: [],
            detailObj:{}
        }
    },
    mounted(){
        this.projectGetAll()    // 项目列表
        this.dictTypeList('RISK_GRADE') // 工点风险等级
        this.riskCategoryFindAll()      // 作业风险类型
        let date = new Date()
        let y = date.getFullYear()
        let m = date.getMonth() + 1
        m = m < 10 ? '0' + m : m
        this.parmes.whereMap.controlTime = y + '-' + m 
    },
    methods: {
        // table单选
        selectRowTable(selection){
            selection.forEach(e=>{
                e.source = 'last'
            })
            this.selectTable = selection
        },
        // 设置项目ID
        setProjectId(){
            setTimeout(()=>{
                this.parmes.whereMap.proId = this.projectIds
                this.dynamicControlReportList()
                this.workstationLedgerList()
            },1000)
        },
        // 工点名称列表
        workstationLedgerList() {
            let parmes = {
                currentPage:1,
                pageSize:9999,
                whereMap:{
                    projectId:this.parmes.whereMap.proId
                }
            }
            this.$api.WorkstationLedger.workstationLedgerList(parmes).then(
                resp => {
                    if (resp.code == 200) {
                        this.workLedgerList = resp.data.resultObject
                    }
                }
            )
        },
        // 作业风险类别--列表
        riskCategoryFindAll(){
            this.$api.MonthlyDynamics.riskCategoryFindAll().then(resp=>{
                if(resp.code == 200){
                    this.operatingRisk = resp.data
                }
            })
        },
        // table列表
        dynamicControlReportList(){
            this.$api.MonthlyDynamics.dynamicControlReportList(this.parmes).then(resp=>{
                if(resp.code == 200){
                    resp.data.resultObject.forEach(e => {
                        e.startTime = this.$time(new Date(e.startTime),'yyyy-MM-dd')
                        e.endTime = this.$time(new Date(e.endTime),'yyyy-MM-dd')
                        if(e.riskLevel == 1){
                            e.riskLevelName = 'Ⅰ级'
                        }else if(e.riskLevel == 2){
                            e.riskLevelName = 'Ⅱ级'
                        }else if(e.riskLevel == 3){
                            e.riskLevelName = 'Ⅲ级'
                        }else{
                            e.riskLevelName = 'Ⅳ级'
                        }
                        if(e.isWorkedThisMonth == 1){
                            e.isWorkedThisMonthName = '是'
                        }else{
                            e.isWorkedThisMonthName = '否'
                        }
                    })
                    this.data1 = resp.data.resultObject
                    this.total = resp.data.totalRecord
                    this.dynamicControlReportStatistics()
                }
            })
        },
        // 数量
        dynamicControlReportStatistics(){
            this.$api.MonthlyDynamics.dynamicControlReportStatistics(this.parmes).then(resp=>{
                if(resp.code == 200){
                    this.riskNum = resp.data
                }
            })
        },
        pageChange(page){
            this.parmes.currentPage = page
            this.dynamicControlReportList()
        },
        sizeChange(num){
            this.parmes.pageSize = num
            this.dynamicControlReportList()
        },
    }
}
</script>
<style scoped>
.those-box{
    margin-top: 20px;
    padding: 20px;
    background-color: #F5F8FC;
}
</style>